import { useState } from 'react'
import { useRequest } from 'alova/client'
import { Button, Result, App } from 'antd'
import { Http } from '../../Utils/Api'
import { refreshStore } from '../../Config/zustand'

const BatchRemove = ({ data, Off }) => {
    const { init, params, url } = data
    const { notification } = App.useApp()
    const style = { width: 160, margin: 16 }
    const [loading, setLoading] = useState(false)
    const { updateRefresh } = refreshStore()
    const { send } = useRequest(params => Http({ url, params }), { immediate: false })

    const onDelete = () => {
        setLoading(true)
        const data = init.map(key => ({ [params]: key }))
        send(data).then(res => {
            notification.success({ key: 'fromModify', message: '操作成功', description: res.message })
            updateRefresh(new Date().getTime())
            setLoading(false)
            Off()
        })
    }

    return (
        <Result
            status="warning"
            title="删除后数据将不恢复,是否确认删除?"
            extra={[
                <Button key="A01" size='large' style={style} type="default" loading={loading} onClick={Off} >取消</Button>,
                <Button key="A02" size='large' style={style} type="primary" loading={loading} onClick={onDelete} danger>删除</Button>
            ]}
        />
    );
};

export default BatchRemove;